:root{
    --color: #555;
    --color2: #777;
    --color3: #999;
    --hover-acolor:#e5cb94;
    --back:#f5f5f5;
    --backeee:#e5e5e5;
    --backfd:#fdfdfd;
    --box-width: 70%;
}
/*header*/
.header{height: 50px;background: var(--back);box-shadow: 0 0 10px #dbdbdb;}
.header .header-box{}
.header .header-box:after{clear:both;content:'.';display:block;width: 0;height: 0;visibility:hidden;}
.header .header-box .header-logo{height: 50px;line-height: 50px;font-size: 20px;float: left;padding-right: 30px;width: 160px;margin-left: 20px;}
.header .header-box .header-logo a{color: var(--color)}
.header .header-box .header-user{float: right;height: 30px;padding: 10px 0;line-height: 30px;font-size: 14px;color: var(--color2);position: relative;margin-right: 20px;cursor: pointer;}
.header .header-box .header-user span{color: var(--color3);margin-left: 8px;}
.header .header-box .header-user ul{position: absolute;top:50px;right: 0;z-index: 5;box-shadow: 0 0 10px #dbdbdb;height: 0;overflow: hidden;-webkit-transition: 1s;transition: 1s;opacity: 0;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;background: #fff;width: 100px;}
.header .header-box .header-user ul li{line-height: 35px;height: 35px;float: none!important;}
.header .header-box .header-user:hover ul{height: 70px;padding: 10px 0;opacity: 1;}
.header .header-box ul{float: left;max-width: 600px;}
.header .header-box ul li{float: left;line-height: 50px;box-sizing: border-box;height: 50px;position: relative;}
.header .header-box ul li a{padding: 0 20px;color: var(--color2);}
.header .header-box ul li a:hover{color: var(--hover-acolor);}
.header .header-box ul li.on{border-bottom: 2px solid var(--hover-acolor);}
.header .header-box ul li.on a.main-nav-a{color: var(--hover-acolor);}
.header .header-box ul li ol{position: absolute;top:50px;left: 0;z-index: 5;box-shadow: 0 0 10px #dbdbdb;overflow: hidden;-webkit-transition: 1s;transition: 1s;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;background: #fff;width: 100px;height: 0;opacity: 0;}
.header .header-box ul li ol li{line-height: 35px;height: 35px;float: none!important;}
.header .header-box ul li:hover ol{height: 35px;padding: 10px 0;opacity: 1;}


.admin-main{overflow: hidden;}
.admin-main .admin-nav{position: absolute;left: 0;top:50px;bottom: 0;z-index: 5;box-shadow: 0 0 10px #dbdbdb;width: 160px;display: none;}
.admin-main .admin-nav ul{padding: 20px 0;}
.admin-main .admin-nav ul li{line-height: 40px;text-align: center;}
.admin-main .admin-nav ul li a{color: var(--color2);}
.admin-main .admin-nav ul li a:hover{color: var(--hover-acolor);}

footer{position: fixed;bottom: 0;z-index: 1000;background:#fff;left: 0;line-height: 25px;padding: 15px 0;text-align: center;right: 0;color: var(--color2);box-shadow: 0 0 10px #dbdbdb;}

.admin-box{margin-left: 20px;margin-top: 15px;padding-bottom: 55px;margin-right: 20px;}

.admin-title{padding: 15px;color: var(--color);font-size: 16px;margin-bottom: 15px;border-bottom: 1px solid #dcdcdc;}

.crumbs-nav{background: var(--back);padding: 15px 20px;color: var(--color2);font-size: 12px;margin-bottom: 15px;box-shadow: 0 0 10px #dbdbdb;}

.admin-table{margin-bottom: 15px;box-shadow: 0 0 10px #dbdbdb;}
.admin-table table{width: 100%;}
.admin-table table tr:nth-child(odd){background: #fbfbfb;}
.admin-table table tr:hover{background: #fbfbfb;}
.admin-table table tr th{height: 40px;background: var(--back);text-align: center;color: var(--color2);font-weight: normal;}
.admin-table table tr td{padding: 15px 10px;text-align: center;color: var(--color2);font-weight: normal;}

.pages{overflow: hidden;box-shadow: 1px 10px 10px #f5f5f5,-1px -1px 10px #f5f5f5;padding: 15px;margin-bottom: 15px;color: var(--color2);}
.pages:after{clear:both;content:'.';display:block;width: 0;height: 0;visibility:hidden;}
.pages .pages-pr{width: 10%;float: left;text-align: left;}
.pages .pages-center{width: 80%;float: left;text-align: center;color: var(--color3);}
.pages .pages-center a{padding: 0 8px;}
.pages .pages-center a:hover{color: var(--hover-acolor);}
.pages .pages-center a.active{color: var(--hover-acolor);}
.pages .pages-ne{width: 10%;float: left;text-align: right;}


.main-form{margin-bottom: 15px;box-shadow: 0 0 10px #dbdbdb;padding: 30px 20px 20px;}
.main-form .form-li{overflow: hidden;}
.main-form .form-li label{float: left;width: 150px;text-align: right;font-size: 14px;color: var(--color2);line-height: 35px;}
.main-form .form-li .form-box{margin-left: 150px;position: relative;padding-bottom: 35px;}
.main-form .form-li .form-box select{width: 260px;height: 35px;line-height: 35px;border: 1px solid #ececec;box-sizing: border-box;padding: 0 5px;border-radius: 5px;}
.main-form .form-li .form-box input[type='text']{width: 300px;height: 35px;line-height: 35px;border: 1px solid #ececec;box-sizing: border-box;padding: 0 5px;border-radius: 5px;}
.main-form .form-li .form-box input[type='password']{width: 300px;height: 35px;line-height: 35px;border: 1px solid #ececec;box-sizing: border-box;padding: 0 5px;border-radius: 5px;}
.main-form .form-li .form-box textarea{width: 300px;line-height: 35px;border: 1px solid #ececec;box-sizing: border-box;padding: 3px 5px;border-radius: 5px;}
.main-form .form-li .form-box input[type="submit"]{padding: 0 25px;height: 35px;background: var(--hover-acolor);color: #fff;border-radius: 5px;cursor: pointer;}
.main-form .form-li .form-box input[type="button"]{padding: 0 25px;height: 35px;background: var(--hover-acolor);color: #fff;border-radius: 5px;cursor: pointer;}
.main-form .form-li .form-box p{line-height: 35px;color: var(--color2);display: inline-block;}

.main-404{padding: 8% 20%;text-align: center;}
.main-404 img{width: 300px;}
.main-404 p{font-size: 14px;color: var(--color2);padding: 10px;letter-spacing: 5px;}
.main-404 p a{text-decoration: underline;}

#admin-hint{position: fixed;top:-50px;left: 50%;width: 300px;margin-left: -150px;background: rgba(229,203,148,.5);opacity: 0;padding: 10px;text-align: center;font-size: 14px;color: #fff;border-radius: 15px;-webkit-transition: .5s;transition: .5s;}
#admin-hint.on{top:20px;opacity: 1;}

.admin-tet-err{position: absolute;left: 0;bottom: -25px;line-height: 25px!important;background: rgba(229,203,148,.5);opacity: 0;text-align: center;font-size: 14px;color: #666!important;border-radius: 3px;-webkit-transition: .5s;transition: .5s;padding: 0 8px;}
.admin-tet-err.on{bottom:10px;opacity: 1;}
